.x6-menu {
 display:inline-block;
 min-width:160px;
 min-height:32px;
 margin:0;
 padding:4px 0;
 background-color:#fff;
 outline:0;
 box-shadow:0 2px 10px rgba(0,0,0,.12)
}
.x6-menu,
.x6-menu-item {
 position:relative
}
.x6-menu-item-active>.x6-menu-item-button,
.x6-menu-item:hover>.x6-menu-item-button {
 color:#262626;
 background:#f5f5f5
}
.x6-menu-item-divider {
 display:block;
 width:100%;
 height:1px;
 margin:4px 0;
 background:hsla(0,0%,58.8%,.2);
 pointer-events:none
}
.x6-menu-item-button {
 position:relative;
 display:flex;
 align-content:center;
 align-items:center;
 justify-content:space-between;
 width:100%;
 height:28px;
 padding:0 12px;
 color:#595959;
 text-align:left;
 background:transparent;
 border:none;
 outline:none;
 box-shadow:none;
 cursor:pointer
}
.x6-menu-item-hidden {
 display:none
}
.x6-menu-item-disabled:hover>.x6-menu-item-button,
.x6-menu-item-disabled>.x6-menu-item-button {
 color:#595959;
 background-color:transparent;
 cursor:not-allowed;
 opacity:.4
}
.x6-menu-item-icon {
 position:absolute;
 top:50%;
 left:6px;
 display:none;
 width:24px;
 height:24px;
 margin-top:-12px;
 font-size:13px
}
.x6-menu-item-text {
 padding-right:56px;
 overflow:hidden;
 font-size:13px;
 white-space:nowrap;
 text-overflow:ellipsis
}
.x6-menu-item-hotkey {
 font-size:13px;
 opacity:.75
}
.x6-menu-submenu-arrow,
.x6-menu-submenu.x6-menu-item-disabled:hover>.x6-menu-item-button>.x6-menu-submenu-arrow {
 position:absolute;
 top:10px;
 right:12px;
 width:0;
 height:0;
 border-top:4px solid transparent;
 border-bottom:4px solid transparent;
 border-left:5px solid #262626;
 opacity:.4;
 pointer-events:none
}
.x6-menu-submenu-menu,
.x6-menu-submenu.x6-menu-item-disabled:hover>.x6-menu-submenu-menu {
 position:absolute;
 top:-5px;
 left:100%;
 z-index:9999;
 min-width:200px;
 margin-left:-4px;
 padding:5px 0;
 background:#fff;
 box-shadow:0 2px 10px rgba(0,0,0,.12);
 transform:translateX(-10px);
 visibility:hidden;
 opacity:0;
 transition:all .25s cubic-bezier(.3,1.2,.2,1)
}
.x6-menu-submenu.x6-menu-item-active>.x6-menu-item-button>.x6-menu-submenu-arrow,
.x6-menu-submenu:hover>.x6-menu-item-button>.x6-menu-submenu-arrow {
 opacity:.75
}
.x6-menu-submenu.x6-menu-item-active>.x6-menu-submenu-menu,
.x6-menu-submenu:hover>.x6-menu-submenu-menu {
 transform:translateX(0);
 visibility:visible;
 opacity:1
}
.x6-menu.x6-menu-has-icon .x6-menu-item-button {
 padding-left:30px
}
.x6-menu.x6-menu-has-icon .x6-menu-item-button .x6-menu-item-icon {
 display:flex;
 align-items:center;
 justify-content:center
}
.x6-menu.x6-menu-has-icon .x6-menu-item-button .x6-menu-item-text {
 padding-left:2px
}
.x6-dropdown {
 position:absolute;
 top:-9999px;
 left:-9999px;
 z-index:9999;
 display:block;
 max-height:320px;
 overflow-y:scroll;
 border-radius:3px;
 box-shadow:0 1px 6px rgba(0,0,0,.2)
}
.x6-dropdown-hidden {
 display:none
}
.x6-dropdown-overlay {
 display:inline-block
}
.x6-dropdown.slide-down-appear.slide-down-appear-active.x6-dropdown-placement-bottomCenter,
.x6-dropdown.slide-down-appear.slide-down-appear-active.x6-dropdown-placement-bottomLeft,
.x6-dropdown.slide-down-appear.slide-down-appear-active.x6-dropdown-placement-bottomRight,
.x6-dropdown.slide-down-enter.slide-down-enter-active.x6-dropdown-placement-bottomCenter,
.x6-dropdown.slide-down-enter.slide-down-enter-active.x6-dropdown-placement-bottomLeft,
.x6-dropdown.slide-down-enter.slide-down-enter-active.x6-dropdown-placement-bottomRight {
 -webkit-animation-name:x6SlideUpIn;
 animation-name:x6SlideUpIn
}
.x6-dropdown.slide-up-appear.slide-up-appear-active.x6-dropdown-placement-topCenter,
.x6-dropdown.slide-up-appear.slide-up-appear-active.x6-dropdown-placement-topLeft,
.x6-dropdown.slide-up-appear.slide-up-appear-active.x6-dropdown-placement-topRight,
.x6-dropdown.slide-up-enter.slide-up-enter-active.x6-dropdown-placement-topCenter,
.x6-dropdown.slide-up-enter.slide-up-enter-active.x6-dropdown-placement-topLeft,
.x6-dropdown.slide-up-enter.slide-up-enter-active.x6-dropdown-placement-topRight {
 -webkit-animation-name:x6SlideDownIn;
 animation-name:x6SlideDownIn
}
.x6-dropdown.slide-down-leave.slide-down-leave-active.x6-dropdown-placement-bottomCenter,
.x6-dropdown.slide-down-leave.slide-down-leave-active.x6-dropdown-placement-bottomLeft,
.x6-dropdown.slide-down-leave.slide-down-leave-active.x6-dropdown-placement-bottomRight {
 -webkit-animation-name:x6SlideUpOut;
 animation-name:x6SlideUpOut
}
.x6-dropdown.slide-up-leave.slide-up-leave-active.x6-dropdown-placement-topCenter,
.x6-dropdown.slide-up-leave.slide-up-leave-active.x6-dropdown-placement-topLeft,
.x6-dropdown.slide-up-leave.slide-up-leave-active.x6-dropdown-placement-topRight {
 -webkit-animation-name:x6SlideDownOut;
 animation-name:x6SlideDownOut
}
@-webkit-keyframes x6SlideUpIn {
 0% {
  transform:scaleY(.8);
  transform-origin:0 0;
  opacity:0
 }
 to {
  transform:scaleY(1);
  transform-origin:0 0;
  opacity:1
 }
}
@keyframes x6SlideUpIn {
 0% {
  transform:scaleY(.8);
  transform-origin:0 0;
  opacity:0
 }
 to {
  transform:scaleY(1);
  transform-origin:0 0;
  opacity:1
 }
}
@-webkit-keyframes x6SlideUpOut {
 0% {
  transform:scaleY(1);
  transform-origin:0 0;
  opacity:1
 }
 to {
  transform:scaleY(.8);
  transform-origin:0 0;
  opacity:0
 }
}
@keyframes x6SlideUpOut {
 0% {
  transform:scaleY(1);
  transform-origin:0 0;
  opacity:1
 }
 to {
  transform:scaleY(.8);
  transform-origin:0 0;
  opacity:0
 }
}
@-webkit-keyframes x6SlideDownIn {
 0% {
  transform:scaleY(.8);
  transform-origin:100% 100%;
  opacity:0
 }
 to {
  transform:scaleY(1);
  transform-origin:100% 100%;
  opacity:1
 }
}
@keyframes x6SlideDownIn {
 0% {
  transform:scaleY(.8);
  transform-origin:100% 100%;
  opacity:0
 }
 to {
  transform:scaleY(1);
  transform-origin:100% 100%;
  opacity:1
 }
}
@-webkit-keyframes x6SlideDownOut {
 0% {
  transform:scaleY(1);
  transform-origin:100% 100%;
  opacity:1
 }
 to {
  transform:scaleY(.8);
  transform-origin:100% 100%;
  opacity:0
 }
}
@keyframes x6SlideDownOut {
 0% {
  transform:scaleY(1);
  transform-origin:100% 100%;
  opacity:1
 }
 to {
  transform:scaleY(.8);
  transform-origin:100% 100%;
  opacity:0
 }
}
.x6-toolbar {
 display:flex;
 flex-direction:row;
 height:28px;
 margin:0;
 padding:0 0 0 4px;
 overflow:hidden
}
.x6-toolbar-content {
 display:flex;
 flex:1 1;
 flex-direction:row;
 justify-content:space-between;
 overflow:hidden
}
.x6-toolbar-content-extras,
.x6-toolbar-content-inner,
.x6-toolbar-group,
.x6-toolbar-item,
.x6-toolbar-item-icon,
.x6-toolbar-item-text {
 display:flex;
 flex-direction:row
}
.x6-toolbar-content-extras {
 align-content:center;
 align-items:center;
 font-size:14px
}
.x6-toolbar-group:before {
 align-self:center;
 width:1px;
 height:40%;
 margin:0 6px;
 background-color:rgba(0,0,0,.15);
 content:" ";
 pointer-events:none
}
.x6-toolbar-group:first-child:before {
 content:none
}
.x6-toolbar-item {
 align-content:center;
 align-items:center;
 margin:0;
 padding:0 4px;
 color:#595959;
 background-color:transparent;
 border:0;
 border-radius:2px;
 outline:none;
 box-shadow:none;
 cursor:pointer;
 -webkit-user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 user-select:none
}
.x6-toolbar-item.x6-toolbar-item-hidden {
 display:none
}
.x6-toolbar-item.x6-toolbar-item-disabled,
.x6-toolbar-item.x6-toolbar-item-disabled:hover {
 cursor:not-allowed;
 opacity:.4
}
.x6-toolbar-item.x6-toolbar-item-disabled .x6-toolbar-item-icon .x6-toolbar-item:active {
 transform:none
}
.x6-toolbar-item-icon,
.x6-toolbar-item-text {
 align-content:center;
 align-items:center
}
.x6-toolbar-item-icon {
 font-size:14px;
 transition:transform 50ms ease
}
.x6-toolbar-item-icon:active {
 transform:scale(1.27201965)
}
.x6-toolbar-item-text {
 padding-left:4px;
 font-size:12px
}
.x6-toolbar-item-dropdown-wrap {
 margin-top:-13px
}
.x6-toolbar-item-dropdown-arrow {
 width:0;
 height:0;
 margin-left:6px;
 border-color:#262626 transparent transparent;
 border-style:solid;
 border-width:5px 4px 0;
 opacity:.4
}
.x6-toolbar.x6-toolbar-hover-effect {
 height:32px
}
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item {
 margin:4px 2px 4px 0;
 padding:0 6px;
 color:#595959
}
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item-disabled.x6-toolbar-item:hover {
 color:#595959;
 background-color:transparent
}
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item-disabled.x6-toolbar-item:hover .x6-toolbar-item-dropdown-arrow {
 opacity:.4
}
.x6-toolbar-item.x6-toolbar-item-active,
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item.x6-toolbar-item-active,
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item:hover {
 color:#262626;
 background-color:#e0e0e0
}
.x6-toolbar-item.x6-toolbar-item-active .x6-toolbar-item-dropdown-arrow,
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item.x6-toolbar-item-active .x6-toolbar-item-dropdown-arrow,
.x6-toolbar.x6-toolbar-hover-effect .x6-toolbar-item:hover .x6-toolbar-item-dropdown-arrow {
 opacity:.75
}
.x6-toolbar-item.x6-toolbar-item-active {
 margin:4px 0
}
.x6-toolbar.x6-toolbar-big {
 height:32px
}
.x6-toolbar.x6-toolbar-big .x6-toolbar-content-extras {
 font-size:16px
}
.x6-toolbar.x6-toolbar-big .x6-toolbar-item {
 margin:4px 4px 4px 0;
 padding:0 5px;
 border-radius:3px
}
.x6-toolbar.x6-toolbar-big .x6-toolbar-item-text {
 font-size:14px
}
.x6-toolbar.x6-toolbar-big .x6-toolbar-item-icon {
 font-size:16px
}
.x6-toolbar.x6-toolbar-hover-effect.x6-toolbar-big {
 height:40px
}
.x6-toolbar.x6-toolbar-hover-effect.x6-toolbar-big .x6-toolbar-item {
 padding:0 10px
}
.x6-toolbar.x6-toolbar-small {
 height:22px
}
.x6-toolbar.x6-toolbar-small .x6-toolbar-content-extras {
 font-size:12px
}
.x6-toolbar.x6-toolbar-small .x6-toolbar-item {
 padding:0 3px
}
.x6-toolbar.x6-toolbar-small .x6-toolbar-item-text {
 margin-right:2px;
 padding-left:2px;
 font-size:10px
}
.x6-toolbar.x6-toolbar-small .x6-toolbar-item-icon {
 font-size:12px
}
.x6-toolbar.x6-toolbar-small .x6-toolbar-item.x6-toolbar-item-active {
 margin:2px 0
}
.x6-toolbar.x6-toolbar-hover-effect.x6-toolbar-small {
 height:28px
}
.x6-toolbar.x6-toolbar-hover-effect.x6-toolbar-small .x6-toolbar-item {
 margin:4px 2px 4px 0;
 padding:0 5px
}
.x6-toolbar.x6-toolbar-hover-effect.x6-toolbar-small .x6-toolbar-item.x6-toolbar-item-active {
 margin:4px 2px 4px 0
}
.x6-toolbar.x6-toolbar-align-right .x6-toolbar-content {
 flex-direction:row-reverse
}
.demo-toolbar {
 display:block;
 padding:12px 8px;
 border-bottom:1px dashed #f0f0f0;
 opacity:.7;
 transition:opacity .3s
}
.demo-toolbar:hover {
 opacity:1
}
.demo-toolbar>* {
 display:inline-block
}
.demo-toolbar a {
 color:inherit
}
.demo-toolbar form {
 display:inline-block
}
.demo-toolbar button:active,
.demo-toolbar button:focus,
.demo-toolbar form:active,
.demo-toolbar form:focus {
 outline:none
}
.demo-toolbar button {
 padding:0;
 background:none;
 border:0;
 cursor:pointer
}
.demo-toolbar .anticon {
 margin:0 8px;
 cursor:pointer;
 transition:all .3s
}
.demo-toolbar .anticon:hover {
 transform:scale(1.25)
}
.demo-wrap {
 display:flex;
 flex-direction:column;
 border:1px solid #f0f0f0
}
